<template>
  <image mode="scaleToFill" :class="cusClass" :style="{ ...cusStyle, width: size, height: size }" :src="icon"></image>
</template>

<script lang="ts" setup>
  import type { PropType } from 'vue';
  import type { $SizeUnitStr } from '@/mxp-ui/mxp-tool/types/interface';
  import { publicStyeProps } from '../mxp-tool/utils/public-props';
  defineOptions({
    name: 'mxp-icon-image',
  });

  defineProps({
    /** 资源路径 */
    icon: { type: String, default: '' },
    /** 图标大小 */
    size: { type: String as PropType<$SizeUnitStr>, default: '14px' },
    ...publicStyeProps, // 混淆props共有参数
  });
</script>
